/* global Image */
var width = $(window).width();
width=width*2;
var height = $(window).height();
height=height*2;
$(document).ready(function(){
    document.createElement('canvas').getContext('2d');
    var href = window.location.href;
    var valText = window.location.href;
    if(href.indexOf("token") != -1 ){
        valText=href.substring(0,href.lastIndexOf("&"))
    }
    $('#qr_container').qrcode({ render:"canvas",height:100, width:100,correctLevel:0,text:valText } );
});
function convertCanvasToImage(canvas) {
    //新Image对象，可以理解为DOM
    var image = new Image ();
    // canvas.toDataURL 返回的是一串Base64编码的URL
    // 指定格式PNG
    image.src = canvas.toDataURL("image/png");
    image.style.width = '100%';
    image.crossOrigin='Anonymous';
    return image;
}

$("#myCanvas").click(function(){  
    $.closePopup();
    $(".topReturn").show();
});
$("#imgDiv").click(function(){  
    $.closePopup();
    $(".topReturn").show();
});
function createCanvas(productDetail){
     //获取Canvas对象(画布)
  var canvas = document.getElementById("myCanvas");
  
  canvas.width = width;
  canvas.height = height;
  canvas.style.width=width/2+'px';
  canvas.style.height=height/2+'px';
  
  //简单地检测当前浏览器是否支持Canvas对象，以免在一些不支持html5的浏览器中提示语法错误
  if (canvas.getContext){  
      //获取对应的CanvasRenderingContext2D对象(画笔)
      var ctx = canvas.getContext("2d");
      ctx.save();
      
      //背景颜色
      ctx.fillStyle = "#ffffff";
      ctx.fillRect(0,0,width,height);
      
     //藏品图片
     var img = new Image();
     img.crossOrigin = 'anonymous';
     img.src = productDetail.coverImage + '?x-oss-process=image/resize,w_'+ width +'&timeStamp='+new Date().getTime();
     //浏览器加载图片完毕后再绘制图片
     img.onload = function(){
         //ctx.drawImage(img, 0, 0, width, width,0,0,width, width);
         var  pattern = ctx.createPattern(img,'no-repeat');
         //设置填充属性
         ctx.fillStyle = pattern;
         ctx.fillRect(0,0,width,width);
 
         //获取二维码图片
         var mycanvas1 = document.getElementsByTagName('canvas')[0];
         var img1 = new Image();
         img1.src = mycanvas1.toDataURL('images/jpeg', 1);
         img1.onload = function(){
            //藏品名字  最多两行 
            ctx.font = "40px Arial";
            ctx.fillStyle = '#000000';   // 文字填充颜色
            var t = productDetail.name;
            var chr = t.split("");
            var temp = "";              
            var row = [];
            for (var a = 0; a < chr.length; a++){
                if ( ctx.measureText(temp).width < width && ctx.measureText(temp + (chr[a])).width <= width){
                    temp += chr[a];
                } else {
                    row.push(temp);
                    temp = chr[a];
                }
            }
            row.push(temp);
            if (row.length > 1){
                var str=row[0];
                str = str.substring(0,str.length - 1) + '...';
                ctx.fillText(str,15,width + 70);
            //    for (var b = 0; b < 2; b++){
            //        var str = row[b];
            //        if (b == 1){
            //            str = str.substring(0,str.length - 1) + '...';
            //        }
            //        ctx.fillText(str,10,width + (b + 1) * 60 + 10);
            //    }
            } else if (row.length == 1){
               ctx.fillText(row[0],15,width + 70);
            }

            //尺寸
            if(productDetail.sizeDesc){
                ctx.font = "30px Arial";
                ctx.fillStyle = '#666666';
                ctx.fillText('【尺寸】'+productDetail.sizeDesc,10, width + 150);
            }
            
            //藏品描述
            if(productDetail.detailsDesc){
                ctx.font = "30px Arial";
                ctx.fillStyle = '#666666';
                ctx.fillText('【描述】'+productDetail.detailsDesc,10, width + 200);
            }
       
            //价格
            ctx.font = "60px Arial";
            ctx.fillStyle = 'red';
            ctx.fillText('¥' + productDetail.price,50, width + 300);

            //描述
            ctx.font = "30px Arial";
            ctx.fillStyle = 'gray';
            var desc = "长按识别二维码，把宝贝带回家";
            ctx.fillText(desc,width - ctx.measureText(desc).width - 30, height - 40);

            //上二维码图片
            ctx.drawImage(img1, width - 190, height - 260, 160, 160); 
            
            ctx.restore();
            
            setTimeout(()=>{
               var canvasimg = convertCanvasToImage(canvas);
                $('#imgDiv').append(canvasimg); 　　　
            },0);
            
             
         };
     };
    

 }
}
/* global ClipboardJS */
var clipboard = new ClipboardJS('#copyUrl', {
    text: function() {
        var href = window.location.href;
        var valText = window.location.href;
        if(href.indexOf("token") != -1 ){
            valText=href.substring(0,href.lastIndexOf("&"))
        }
        return valText;
    }
});

clipboard.on('success', function(e) {
    $("#copyTtml").text('复制成功');
    $.toast('复制成功!');
});
clipboard.on('error', function(e) {
    $.toast('复制失败');
});



